<template>
<div class="tuijianzonghe">
    <div class="weinituijiantext">&nbsp;&nbsp;&nbsp;&nbsp;为你推荐</div>
    <div class="weiniyuijian">
        <div class="tuijiantu">
            <div class="tuijianleft">
                <img :src="arr4.img1" alt="">
            </div>
            <div class="tuijianright">
                <div class="tuijiantus">
                    <img :src="arr4.img2" alt="">
                </div>
                <div class="tuijiantus">
                     <img :src="arr4.img3" alt="">
                </div>
            </div>
        </div>
    </div>
</div>
    
</template>

<script>
import getlink from "../../apis/getapi"
export default {
    data() {
        return {
            arr4:[],
        }
    },
    mounted() {
        getlink("/data/list/xiaoming").then((ok)=>{
            console.log(ok.data.faxianfour);
            this.arr4 = ok.data.faxianfour;
        })
    }
}
</script>

<style scoped>
    .weiniyuijian{
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 3rem;
    }
    .weinituijiantext{
        font-size: .2rem;
        width: 100%;
        height: .4rem;
        line-height: .4rem;
        font-weight: 500;
    }
    .tuijiantu{
        display: flex;
        justify-content: space-between;
        width: 90%;
        height: 2.6rem;
    }
    .tuijianleft{
        border-radius: .2rem;
        width: 48%;
        height: 100%;
    }
    .tuijianleft img{
        width: 100%;
        height: 100%;
        border-radius: .2rem;
    }
    .tuijianright{
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        width: 48%;
        height: 100%;
    }
    .tuijiantus{
        width:100% ;
        height: 48%;
        border-radius: .2rem;
    }
    .tuijiantus img{
          width: 100%;
        height: 100%;
        border-radius: .2rem;
    }
</style>